﻿

function show(id)
{
   $('#' + id + 'Canvas').css('display', 'none');
}
		   
function hide(id)
{
   $('#' + id + 'Canvas').css('display', 'block');
}
		   

$(function(){
  commentboard_limit = 10;

	function LoadCommentBoard()
	{
		hide('cb_container');
		//$('#cb_containerCanvas').hide('slow');

		$.ajax({
		  url: '/commentboard/display/?id=' + boardId + '&n=' + commentboard_limit,
		  type: 'GET',
		  dataType: 'text',
		  timeout: 10000,
		  error: function(){
			  //show('cb_container');
     		show('cb_container');
		  },
		  success: function(xml){
     		show('cb_container');
			  var commentboard = $('.cb_commentboard');
        var currentId = parseInt($('.commentId:first').attr('title'));
			  
			  if ($(xml).find('.comment').size() > 0)
			  {
				 var currentCommentsNumber = commentboard.find('.cb_comment').size();
				 if (currentCommentsNumber == 0)
				 {
					 commentboard.empty();
				 }
				 var i = 0;
				$(xml).find('.comment').each(
				  function() {
            // Compre ID, only deal with new Comments.
            var thisId = parseInt($(this).attr('id'));
            if (thisId <= currentId)
            {
               return;
            }

					  var comment = $('<div class="cb_comment" title=""><a class="commentId" title="" style="display:none"></a><div class="cb_info"><a class="user_link" href=""><img width="60" height="60" class="cb_photo"/></a></div><div class="cb_content"><div class="text"></div><div class="author">&mdash <a class="user_link" href=""><span id="comment_user_name"></span></a> 发表于 <span id="comment_date"></span></div></div> <div style="clear:both"></div></div>');
					  comment.find('#comment_user_name').append($(this).find('.username').text()); 
            comment.find('#comment_date').append($(this).find('.comment_date').text());
					  comment.find('.text').append($(this).find('.content').html());
            comment.find('.cb_photo').attr('src', $(this).find('.photo').text());
            comment.find('.user_link').attr('href', $(this).find('.user_link').text());
            comment.find('.commentId').attr('title', $(this).attr('id'));
					  comment.hover(
						function() {
							$(this).css('background-color', '#DDDCD9');
						},
						function() {
							$(this).css('background-color', '#FFF');
						}
					  )
					  comment.prependTo(commentboard).hide().slideDown(500)	;
				  }
				)

       // delete some comments.
       commentboard.find('.cb_comment:gt(' + (commentboard_limit - 1) + ')').slideUp(500);


			}
			else
			{
  		  commentboard.empty();
			  commentboard.append('还没有任何评论，请添加评论');
			}
				
			 
		  }
		});
	}
		   
		   
	$('#submit').click(
		function(){
			//validation.
			 if ($('#cb_commentText').val().trim().length == 0)
			 {
				 alert('请写点什么吧！');
				 return;
			 }
			
			hide('cb_container');
			$.ajax({
			  url: '/commentboard/addcomment/',
			  type: 'POST',
			  data: {'board_id':boardId,
               'content':$('#cb_commentText').val()},
			  dataType: 'text',
			  timeout: 10000,
			  error: function(){
				  show('cb_container');
			  },
			  success: function(xml){
				  $('#cb_commentText').val('');
				  LoadCommentBoard();
			  }
		   })
		}
	)
	
	$('#cb_updateBoard').click(
		function() {
			LoadCommentBoard();
		}
	);
	
	
	LoadCommentBoard();
		 

	

})
